<template>
<!--  此处path变量通过下面data()方法赋值，从而改变导航栏默认高亮-->

    <el-menu
        router
        :default-active="path"
        class="el-menu-demo"
        mode="horizontal"
        background-color="#545c64"
        text-color="#fff"
        active-text-color="#ffd04b"
    >
      <el-sub-menu index="1">
      </el-sub-menu>
      <el-menu-item index="/Home">
        <i class="el-icon-house"></i>
        <template #title>Home</template>
      </el-menu-item>
      <el-menu-item index="/Workbench">
        <i class="el-icon-s-promotion"></i>
        <template #title>Workbench</template>
      </el-menu-item>
      <el-menu-item index="/History">
        <i class="el-icon-reading"></i>
        <template #title>History</template>
      </el-menu-item>
      <el-menu-item index="/Settings">
        <i class="el-icon-setting"></i>
        <template #title>Settings</template>
      </el-menu-item>
      <el-menu-item index="/Documents">
        <i class="el-icon-document"></i>
        <template #title>Documents</template>
      </el-menu-item>

    </el-menu>



</template>

<script>
import request from "@/utils/request";

export default {
  name: "TopMenu",
  data(){
    return{
      user:{},
      path: this.$route.path
    }
  },

}
</script>

<style scoped>

</style>